<template>
  <el-card shadow="never">
    <div slot="header" class="card-header">
      <span>用户权限管理</span>
    </div>
    <el-table :data="tableData" border style="width: 100%">
      <el-table-column prop="columnA" label="用户账号"> </el-table-column>
      <el-table-column prop="columnB" label="用户姓名"> </el-table-column>
      <el-table-column prop="columnC" label="用户级别">
        <template slot-scope="scop">
          <el-select size="mini" v-model="selectValA">
            <el-option
              v-for="(item, index) in scop.row.columnC"
              :key="index"
              :label="item"
              :value="index"
            >
            </el-option>
          </el-select>
        </template>
      </el-table-column>
      <el-table-column prop="columnD" label="访问权限">
        <template slot-scope="scop">
          <el-select size="mini" v-model="selectValB">
            <el-option
              v-for="(item, index) in scop.row.columnD"
              :key="index"
              :label="item"
              :value="index"
            >
            </el-option>
          </el-select>
        </template>
      </el-table-column>
      <el-table-column prop="columnE" label="红名单设置">
        <template slot-scope="scope">
          <i class="el-icon-check" v-if="scope.row.columnE"></i>
        </template>
      </el-table-column>
    </el-table>
  </el-card>
</template>

<script>
export default {
  props: {
    tableData: {
      type: Array,
      default: () => []
    }
  },

  data() {
    return {
      selectValA: 0,
      selectValB: 0
    }
  }
}
</script>

<style lang="scss" scoped></style>
